var app;

jQuery(document).ready(function(){
	app = new Vue({
        el: '#app',
        data: {
        	tabName : 'HeaderParams',
            url : getUrlDomain()+"mobile/plugin/westvalley/tools/http/test/httpRequestTest.jsp",
            connTimeOut : 60,
            readTimeOut : 60,
            headerLabel : function(h){
            	var html = 'HeaderParams';
            	var headerBadgeCount = app.headerParams.length;
            	if( headerBadgeCount>0 ){
            		html = h('div', [h('span', html),h('Badge', {props: {count: headerBadgeCount,"class-name":"tabPane-badge-alone" } }) ]);
            	}
            	return html;
            },
            headerParams : [ { 
            	name:'Content-Type',
            	value:'application/x-www-form-urlencoded;charset=utf-8'
            } ],
            formLabel : function(h){
            	var html = 'FormParams';
            	var formBadgeCount = app.formParams.length;
            	if( formBadgeCount>0 ){
            		html = h('div', [h('span', html),h('Badge', {props: {count: formBadgeCount,"class-name":"tabPane-badge-alone"} }) ]);
            	}
            	return html;
            },
            formParams : [ ],
            bodyContentType : 'application/json',
            bodyParams : '',
            resultType : 'text',
            resultTypeList : [ {value:'text',label:'text'},{value:'json',label:'json'},{value:'xml',label:'xml'} ],
            execResult : '',
            execResultDisplay :''
        },
        methods: {
        	selectTabs : function(name){
        		this.tabName = name;
        	},
        	addHeader : function(){
        		this.headerParams.push({
        			name:'',
                	value:''
                });
        	},
        	removeHeader : function(index){
        		this.headerParams.splice(index, 1);
        	},
        	addForm : function(){
        		this.formParams.push({
        			name:'',
                	value:''
                });
        	},
        	removeForm : function(index){
        		this.formParams.splice(index, 1);
        	},
        	executeRequest : function(){
        		var data = {
        			url : this.url,
        			connTimeOut : this.connTimeOut,
        			readTimeOut : this.readTimeOut,
        			headerParams : JSON.stringify(this.headerParams),
        			formParams : JSON.stringify(this.formParams),
        			bodyContentType : this.bodyContentType,
        			bodyParams : this.bodyParams
        		};
        		var o = ajaxJson("/mobile/plugin/westvalley/tools/http/jsp/ajaxExecuteRequest.jsp",data);
        		if(o){
        			this.execResult = o.msg;
        		}else{
        			this.execResult = 'Request Error!';
        		}
        		formatResult();
        	},
        	selectResultType : function(value){
        		formatResult();
        	}
        },
        created: function(){
        }
    });
});

function formatResult(){
	if( "json" == app.resultType ){
		var json = null;
		try{
			json = eval('(' + app.execResult + ')'); 
			app.execResultDisplay = JSON.stringify(json, null, "\t");
		}catch (e) {
			app.execResultDisplay = myTrim(app.execResult);
		}
	}else if( "xml" == app.resultType ){
		app.execResultDisplay = formatXml(app.execResult);
	}else{
		app.execResultDisplay = myTrim(app.execResult);
	}
	app.tabName = "ExecuteResult";
}


function myTrim(x) {
    return x.replace(/^\s+|\s+$/g, "");
}

/**
 * 异步提交
 * 
 * @param url
 * @param data
 * @returns json
 */
function ajaxJson(url, data) {
	var datas = null;
	jQuery.ajax({
		type : "POST",
		url : url,
		data : data,
		dataType : "json",
		async : false,
		success : function(data) {
			datas = data;
		},
		error: function(x,msg){
			//alert(msg);
		}
	});
	return datas;
}

function getUrlDomain(){
	var url = "";
	var protocol = window.location.protocol;
	if(protocol!="")  url += protocol+"//";
	var domain = window.location.hostname;
	if(domain!="") url += domain;
	var port = window.location.port;
	if(port!="") url += ":"+port;
	return url+"/";
}